<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>首页</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body {
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
            background: #f5f7fa;
            min-height: 100vh;
            color: #333;
            font-size: 14px;
            line-height: 1.5;
            margin: 0;
            padding: 0;
        }

        .header {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            color: white;
            padding: 20px;
            text-align: center;
            position: relative;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
        }

        .header h1 {
            font-size: 24px;
            font-weight: 600;
            margin-bottom: 5px;
        }

        .header p {
            font-size: 14px;
            opacity: 0.9;
        }

        .company-switcher {
            position: absolute;
            right: 20px;
            top: 50%;
            transform: translateY(-50%);
            background: rgba(255, 255, 255, 0.2);
            border-radius: 50%;
            width: 40px;
            height: 40px;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            transition: all 0.3s ease;
        }

        .company-switcher:hover {
            background: rgba(255, 255, 255, 0.3);
            transform: translateY(-50%) scale(1.1);
        }

        .switch-icon {
            font-size: 18px;
        }

        /* 弹窗样式 */
        .company-modal {
            display: none;
            position: fixed;
            z-index: 1000;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.5);
        }

        .company-modal-content {
            background-color: white;
            margin: 5% auto;
            padding: 0;
            border-radius: 15px;
            width: 90%;
            max-width: 500px;
            max-height: 80vh;
            overflow: hidden;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
        }

        .modal-header {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            color: white;
            padding: 20px;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .modal-header h3 {
            margin: 0;
            font-size: 18px;
        }

        .close-btn {
            font-size: 24px;
            cursor: pointer;
            opacity: 0.8;
        }

        .close-btn:hover {
            opacity: 1;
        }

        .search-box {
            padding: 20px;
            border-bottom: 1px solid #eee;
        }

        .search-box input {
            width: 100%;
            padding: 12px 16px;
            border: 1px solid #ddd;
            border-radius: 25px;
            font-size: 14px;
            outline: none;
        }

        .search-box input:focus {
            border-color: #667eea;
            box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.2);
        }

        .company-list {
            max-height: 300px;
            overflow-y: auto;
            padding: 0;
        }

        .company-item {
            padding: 16px 20px;
            border-bottom: 1px solid #f0f0f0;
            cursor: pointer;
            transition: all 0.2s ease;
            border-radius: 8px;
            margin: 4px 0;
        }

        .company-item:hover {
            background-color: #f8f9fa;
            transform: translateY(-1px);
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
        }

        .company-item.selected {
            background-color: #e3f2fd;
            border-left: 4px solid #667eea;
            box-shadow: 0 2px 8px rgba(102, 126, 234, 0.2);
        }

        .company-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 8px;
        }

        .company-name {
            font-weight: 600;
            color: #333;
            font-size: 15px;
        }

        .company-type {
            background: #667eea;
            color: white;
            padding: 2px 8px;
            border-radius: 12px;
            font-size: 11px;
            font-weight: 500;
        }

        .company-desc {
            font-size: 13px;
            color: #666;
            margin-bottom: 6px;
            line-height: 1.4;
        }

        .company-area {
            font-size: 12px;
            color: #999;
            display: flex;
            align-items: center;
            gap: 4px;
        }

        .pagination {
            padding: 20px;
            text-align: center;
            border-top: 1px solid #eee;
        }

        .page-btn {
            display: inline-block;
            padding: 8px 12px;
            margin: 0 4px;
            border: 1px solid #ddd;
            background: white;
            color: #333;
            text-decoration: none;
            border-radius: 4px;
            cursor: pointer;
        }

        .page-btn.active {
            background: #667eea;
            color: white;
            border-color: #667eea;
        }

        .page-btn:hover:not(.active) {
            background: #f0f0f0;
        }

        .container {
            max-width: 100%;
            margin: 0;
            padding: 0;
        }

        .content-wrapper {
            padding-bottom: 80px;
        }

        /* 欢迎横幅 */
        .welcome-banner {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            color: white;
            margin: 15px;
            border-radius: 15px;
            padding: 20px;
            text-align: center;
            box-shadow: 0 5px 20px rgba(102, 126, 234, 0.3);
        }

        .welcome-banner h2 {
            font-size: 20px;
            margin-bottom: 10px;
        }

        .welcome-banner p {
            font-size: 14px;
            opacity: 0.9;
        }

        /* 快捷功能 */
        .quick-actions {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 15px;
            margin: 15px;
        }

        .action-card {
            background: white;
            border-radius: 15px;
            padding: 20px;
            text-align: center;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
            transition: all 0.3s ease;
            cursor: pointer;
            border: 1px solid #f0f0f0;
            min-height: 120px;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }

        .action-card:active {
            transform: scale(0.98);
        }

        .action-icon {
            width: 50px;
            height: 50px;
            border-radius: 12px;
            background: linear-gradient(135deg, #667eea, #764ba2);
            color: white;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 20px;
            margin: 0 auto 12px;
        }

        .action-title {
            font-size: 16px;
            font-weight: 600;
            color: #333;
            margin-bottom: 6px;
        }

        .action-description {
            font-size: 12px;
            color: #666;
            line-height: 1.4;
        }

        /* 功能模块 */
        .features-section {
            margin: 15px;
        }

        .section-title {
            font-size: 18px;
            font-weight: 600;
            color: #333;
            margin-bottom: 15px;
            padding-left: 5px;
        }

        .features-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 12px;
        }

        .feature-item {
            background: white;
            border-radius: 12px;
            padding: 16px 12px;
            text-align: center;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
            cursor: pointer;
            transition: all 0.3s ease;
            border: 1px solid #f0f0f0;
        }

        .feature-item:active {
            transform: scale(0.98);
        }

        .feature-icon {
            font-size: 24px;
            margin-bottom: 8px;
            display: block;
        }

        .feature-title {
            font-size: 14px;
            font-weight: 600;
            color: #333;
            margin-bottom: 4px;
        }

        .feature-desc {
            font-size: 11px;
            color: #666;
            line-height: 1.3;
        }

        /* 新闻公告 */
        .news-section {
            margin: 15px;
            background: white;
            border-radius: 15px;
            padding: 20px;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
        }

        .news-item {
            display: flex;
            align-items: flex-start;
            padding: 12px 0;
            border-bottom: 1px solid #f0f0f0;
            cursor: pointer;
        }

        .news-item:last-child {
            border-bottom: none;
        }

        .news-icon {
            width: 40px;
            height: 40px;
            border-radius: 8px;
            background: linear-gradient(135deg, #667eea, #764ba2);
            color: white;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 16px;
            margin-right: 12px;
            flex-shrink: 0;
        }

        .news-content {
            flex: 1;
        }

        .news-title {
            font-size: 14px;
            font-weight: 600;
            color: #333;
            margin-bottom: 4px;
        }

        .news-desc {
            font-size: 12px;
            color: #666;
            line-height: 1.4;
        }

        .news-time {
            font-size: 11px;
            color: #999;
            margin-top: 4px;
        }

        /* 用户状态 */
        .user-status {
            margin: 15px;
            background: white;
            border-radius: 15px;
            padding: 15px;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        .user-info {
            display: flex;
            align-items: center;
        }

        .user-avatar {
            width: 40px;
            height: 40px;
            border-radius: 50%;
            background: linear-gradient(135deg, #667eea, #764ba2);
            color: white;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 16px;
            margin-right: 12px;
        }

        .user-details h3 {
            font-size: 14px;
            font-weight: 600;
            color: #333;
            margin-bottom: 2px;
        }

        .user-details p {
            font-size: 12px;
            color: #666;
        }

        .login-btn {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            color: white;
            border: none;
            padding: 8px 16px;
            border-radius: 20px;
            font-size: 12px;
            cursor: pointer;
            transition: all 0.3s ease;
        }

        .login-btn:active {
            transform: scale(0.95);
        }

        /* 底部导航 */
        .bottom-nav {
            position: fixed;
            bottom: 0;
            left: 0;
            right: 0;
            background: white;
            border-top: 1px solid #e9ecef;
            display: flex;
            justify-content: space-around;
            padding: 8px 0;
            z-index: 1000;
        }

        .nav-item {
            flex: 1;
            text-align: center;
            padding: 8px;
            cursor: pointer;
            transition: all 0.2s ease;
        }

        .nav-item.active {
            color: #667eea;
        }

        .nav-icon {
            font-size: 20px;
            margin-bottom: 2px;
        }

        .nav-label {
            font-size: 11px;
        }

        /* 响应式设计 */
        @media (max-width: 768px) {
            .container {
                margin: 10px;
            }

            .header h1 {
                font-size: 20px;
            }

            .header p {
                font-size: 12px;
            }

            .welcome-banner h2 {
                font-size: 18px;
            }

            .welcome-banner p {
                font-size: 12px;
            }

            .quick-actions {
                grid-template-columns: 1fr;
                gap: 12px;
            }

            .features-grid {
                grid-template-columns: repeat(3, 1fr);
                gap: 8px;
            }

            .section-title {
                font-size: 16px;
            }

            .action-card,
            .feature-item {
                padding: 12px 8px;
            }

            .action-icon {
                width: 40px;
                height: 40px;
                font-size: 18px;
            }

            .feature-icon {
                font-size: 18px;
            }

            .feature-title {
                font-size: 12px;
            }

            .feature-desc {
                font-size: 10px;
            }

            .company-modal-content {
                margin: 10% auto;
                width: 95%;
                max-height: 85vh;
            }
            
            .company-switcher {
                width: 35px;
                height: 35px;
                right: 15px;
            }
            
            .switch-icon {
                font-size: 16px;
            }
        }
    </style>
</head>
<body>
    <div class="header">
        <h1>🏠 采购平台</h1>
        <p>专业的企业采购服务平台</p>
        <div class="company-switcher" onclick="showCompanySelector()">
            <span class="switch-icon">🔄</span>
        </div>
    </div>

    <!-- 公司选择弹窗 -->
    <div id="companyModal" class="company-modal">
        <div class="company-modal-content">
            <div class="modal-header">
                <h3>选择采购公司</h3>
                <span class="close-btn" onclick="closeCompanySelector()">&times;</span>
            </div>
            <div class="search-box">
                <input type="text" id="companySearch" placeholder="搜索公司名称..." oninput="filterCompanies()">
            </div>
            <div class="company-list" id="companyList">
                <!-- 公司列表将通过JavaScript动态生成 -->
            </div>
            <div class="pagination" id="pagination">
                <!-- 分页控件 -->
            </div>
        </div>
    </div>

    <div class="container">
        <div class="content-wrapper">
            <!-- 用户状态 -->
            <div class="user-status" id="userStatus">
                <div class="user-info">
                    <div class="user-avatar" id="userAvatar">访</div>
                    <div class="user-details">
                        <h3 id="userTitle">访客用户</h3>
                        <p id="userSubtitle">登录获得更多功能</p>
                    </div>
                </div>
                <button class="login-btn" id="loginBtn" onclick="goToLogin()">登录</button>
            </div>

            <!-- 欢迎横幅 -->
            <!-- <div class="welcome-banner">
                <h2>🎉 欢迎使用采购平台</h2>
                <p>为您提供专业的企业采购服务，让采购更简单、更高效</p>
            </div> -->
          <!-- 功能模块 -->
          <div class="features-section">
            <!-- <div class="section-title">🔧 功能模块</div> -->
            <div class="features-grid">
                <div class="feature-item" onclick="handleFeature('new-product')">
                    <div class="feature-icon">🚀</div>
                    <div class="feature-title">推新品</div>
                    <div class="feature-desc">给终端推新品</div>
                </div>
                <div class="feature-item" onclick="handleFeature('plan')">
                    <div class="feature-icon">📋</div>
                    <div class="feature-title">报计划</div>
                    <div class="feature-desc">采购计划标价</div>
                </div>
                <div class="feature-item" onclick="handleFeature('agent')">
                    <div class="feature-icon">🤝</div>
                    <div class="feature-title">招代理</div>
                    <div class="feature-desc">招募合作伙伴</div>
                </div>
                <!-- <div class="feature-item" onclick="handleFeature('analytics')">
                    <div class="feature-icon">📊</div>
                    <div class="feature-title">数据分析</div>
                    <div class="feature-desc">销售数据分析</div>
                </div>
                <div class="feature-item" onclick="handleFeature('inventory')">
                    <div class="feature-icon">📦</div>
                    <div class="feature-title">库存管理</div>
                    <div class="feature-desc">商品库存查询</div>
                </div>
                <div class="feature-item" onclick="handleFeature('settings')">
                    <div class="feature-icon">⚙️</div>
                    <div class="feature-title">系统设置</div>
                    <div class="feature-desc">个人偏好设置</div>
                </div> -->
            </div>
        </div>
            <!-- 快捷功能 -->
            <div class="quick-actions">
                <div class="action-card" onclick="handleAction('scan')">
                    <div class="action-icon">📱</div>
                    <div class="action-title">扫码功能</div>
                    <div class="action-description">扫描商品条码或二维码</div>
                </div>
                <div class="action-card" onclick="handleAction('search')">
                    <div class="action-icon">🔍</div>
                    <div class="action-title">商品搜索</div>
                    <div class="action-description">快速搜索所需商品</div>
                </div>
                <div class="action-card" onclick="handleAction('orders')">
                    <div class="action-icon">📋</div>
                    <div class="action-title">我的订单</div>
                    <div class="action-description">查看订单历史和状态</div>
                </div>
                <div class="action-card" onclick="handleAction('cart')">
                    <div class="action-icon">🛒</div>
                    <div class="action-title">购物车</div>
                    <div class="action-description">管理购物车商品</div>
                </div>
            </div>

  

            <!-- 新闻公告 -->
            <div class="news-section">
                <div class="section-title">📢 新闻公告</div>
                <div class="news-item" onclick="handleNews('1')">
                    <div class="news-icon">📢</div>
                    <div class="news-content">
                        <div class="news-title">平台升级公告</div>
                        <div class="news-desc">系统将于今晚进行升级维护，预计持续2小时</div>
                        <div class="news-time">2024-03-15</div>
                    </div>
                </div>
                <div class="news-item" onclick="handleNews('2')">
                    <div class="news-icon">🎉</div>
                    <div class="news-content">
                        <div class="news-title">新功能上线</div>
                        <div class="news-desc">扫码功能正式上线，支持多种条码格式</div>
                        <div class="news-time">2024-03-14</div>
                    </div>
                </div>
                <div class="news-item" onclick="handleNews('3')">
                    <div class="news-icon">💰</div>
                    <div class="news-content">
                        <div class="news-title">优惠活动</div>
                        <div class="news-desc">春季促销活动开始，多款商品特价优惠</div>
                        <div class="news-time">2024-03-13</div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- 底部导航 -->
    <div class="bottom-nav">
        <div class="nav-item active" onclick="handleNavClick('home')">
            <div class="nav-icon">🏠</div>
            <div class="nav-label">首页</div>
        </div>
        <div class="nav-item" onclick="handleNavClick('dashboard')">
            <div class="nav-icon">📊</div>
            <div class="nav-label">控制台</div>
        </div>
        <div class="nav-item" onclick="handleNavClick('features')">
            <div class="nav-icon">🔧</div>
            <div class="nav-label">功能</div>
        </div>
        <div class="nav-item" onclick="handleNavClick('profile')">
            <div class="nav-icon">👤</div>
            <div class="nav-label">我的</div>
        </div>
    </div>

    <script>
        // 模拟公司数据（实际项目中应该从API获取）
        // const companies = [
        //     { id: 'company1', name: 'ABC采购公司', desc: '专业电子产品采购', type: '采购公司', area: '北京市' },
        //     { id: 'company2', name: 'XYZ贸易公司', desc: '工业原材料供应商', type: '贸易公司', area: '上海市' },
        //     { id: 'company3', name: 'DEF供应链', desc: '全品类采购服务', type: '供应链', area: '深圳市' },
        //     { id: 'company4', name: 'GHI商贸集团', desc: '大宗商品交易', type: '商贸集团', area: '广州市' },
        //     { id: 'company5', name: 'JKL进出口', desc: '国际贸易专家', type: '进出口', area: '天津市' },
        //     { id: 'company6', name: 'MNO采购中心', desc: '政府采购服务', type: '采购中心', area: '杭州市' },
        //     { id: 'company7', name: 'PQR供应链', desc: '快速配送服务', type: '供应链', area: '成都市' },
        //     { id: 'company8', name: 'STU贸易', desc: '专业化工采购', type: '贸易公司', area: '武汉市' },
        //     { id: 'company9', name: 'VWX商贸', desc: '建材采购专家', type: '商贸公司', area: '南京市' },
        //     { id: 'company10', name: 'YZA采购', desc: '食品原料供应', type: '采购公司', area: '西安市' },
        //     { id: 'company11', name: 'BCD电子', desc: '电子元器件采购', type: '电子公司', area: '苏州市' },
        //     { id: 'company12', name: 'EFG机械', desc: '机械设备采购', type: '机械公司', area: '重庆市' }
        // ];



        function showCompanySelector() {
            document.getElementById('companyModal').style.display = 'block';
            renderCompanyList();
            renderPagination();
        }

        function closeCompanySelector() {
            document.getElementById('companyModal').style.display = 'none';
        }

        function filterCompanies() {
            const searchTerm = document.getElementById('companySearch').value.toLowerCase();
            filteredCompanies = companies.filter(company => 
                company.name.toLowerCase().includes(searchTerm) || 
                company.desc.toLowerCase().includes(searchTerm) ||
                company.type.toLowerCase().includes(searchTerm) ||
                company.area.toLowerCase().includes(searchTerm)
            );
            currentPage = 1;
            renderCompanyList();
            renderPagination();
        }

        function renderCompanyList() {
            const companyList = document.getElementById('companyList');
            const startIndex = (currentPage - 1) * itemsPerPage;
            const endIndex = startIndex + itemsPerPage;
            const pageCompanies = filteredCompanies.slice(startIndex, endIndex);

            companyList.innerHTML = pageCompanies.map(company => `
                <div class="company-item ${company.id === currentCompany ? 'selected' : ''}" 
                     onclick="selectCompany('${company.id}')">
                    <div class="company-header">
                        <div class="company-name">${company.name}</div>
                        <div class="company-type">${company.type}</div>
                    </div>
                    <div class="company-desc">${company.desc}</div>
                    <div class="company-area">📍 ${company.area}</div>
                </div>
            `).join('');
        }

        function renderPagination() {
            const totalPages = Math.ceil(filteredCompanies.length / itemsPerPage);
            const pagination = document.getElementById('pagination');
            
            if (totalPages <= 1) {
                pagination.innerHTML = '';
                return;
            }

            let paginationHTML = '';
            
            // 上一页
            if (currentPage > 1) {
                paginationHTML += `<span class="page-btn" onclick="goToPage(${currentPage - 1})">上一页</span>`;
            }
            
            // 页码
            for (let i = 1; i <= totalPages; i++) {
                if (i === currentPage) {
                    paginationHTML += `<span class="page-btn active">${i}</span>`;
                } else {
                    paginationHTML += `<span class="page-btn" onclick="goToPage(${i})">${i}</span>`;
                }
            }
            
            // 下一页
            if (currentPage < totalPages) {
                paginationHTML += `<span class="page-btn" onclick="goToPage(${currentPage + 1})">下一页</span>`;
            }
            
            pagination.innerHTML = paginationHTML;
        }

        function goToPage(page) {
            currentPage = page;
            renderCompanyList();
            renderPagination();
        }

        function selectCompany(companyId) {
            currentCompany = companyId;
            console.log('切换到公司:', companyId);
            
            // 这里可以调用API切换公司
            // 更新当前显示的公司名称
            updateCompanyDisplay(companyId);
            
            // 关闭弹窗
            closeCompanySelector();
        }

        function updateCompanyDisplay(companyId) {
            const company = companies.find(c => c.id === companyId);
            if (company) {
                console.log('已切换到:', company.name);
                // 可以在这里添加切换成功后的其他逻辑
            }
        }

        // 点击弹窗外部关闭
        window.onclick = function(event) {
            const modal = document.getElementById('companyModal');
            if (event.target === modal) {
                closeCompanySelector();
            }
        }

        // 全局函数
        function handleAction(action) {
            console.log('Action clicked:', action);
            
            switch(action) {
                case 'scan':
                    window.location.href = 'barcode-scanner.html';
                    break;
                case 'search':
                    alert('商品搜索功能开发中...');
                    break;
                case 'orders':
                    if (window.authManager && window.authManager.isLoggedIn()) {
                        window.location.href = 'profile.html';
                    } else {
                        alert('请先登录');
                        window.location.href = 'index.html';
                    }
                    break;
                case 'cart':
                    alert('购物车功能开发中...');
                    break;
            }
        }

        function handleFeature(feature) {
            console.log('Feature clicked:', feature);
            
            switch(feature) {
                case 'new-product':
                    alert('推新品功能开发中...');
                    break;
                case 'plan':
                    alert('报计划功能开发中...');
                    break;
                case 'agent':
                    alert('招代理功能开发中...');
                    break;
                case 'analytics':
                    window.location.href = 'dashboard.html';
                    break;
                case 'inventory':
                    alert('库存管理功能开发中...');
                    break;
                case 'settings':
                    window.location.href = 'profile.html';
                    break;
            }
        }

        function handleNews(newsId) {
            console.log('News clicked:', newsId);
            alert('新闻详情功能开发中...');
        }

        function handleNavClick(nav) {
            console.log('Nav clicked:', nav);
            
            switch(nav) {
                case 'home':
                    // 当前页面，不需要跳转
                    break;
                case 'dashboard':
                    window.location.href = 'dashboard.html';
                    break;
                case 'features':
                    window.location.href = 'features.html';
                    break;
                case 'profile':
                    if (window.authManager && window.authManager.isLoggedIn()) {
                        window.location.href = 'profile.html';
                    } else {
                        alert('请先登录');
                        window.location.href = 'index.html';
                    }
                    break;
            }
        }

        function goToLogin() {
            window.location.href = 'index.html';
        }

        // 首页类
        class HomePage {
            constructor() {
                this.init();
            }

            init() {
                this.checkAuthStatus();
                this.bindEvents();
            }

            checkAuthStatus() {
                if (window.authManager && window.authManager.isLoggedIn()) {
                    this.updateUserStatus(true);
                } else {
                    this.updateUserStatus(false);
                }
            }

            updateUserStatus(isLoggedIn) {
                const userStatus = document.getElementById('userStatus');
                const userAvatar = document.getElementById('userAvatar');
                const userTitle = document.getElementById('userTitle');
                const userSubtitle = document.getElementById('userSubtitle');
                const loginBtn = document.getElementById('loginBtn');

                if (isLoggedIn) {
                    const user = window.authManager.getUserInfo();
                    userAvatar.textContent = user ? user.name.charAt(0) : '用';
                    userTitle.textContent = user ? user.name : '已登录用户';
                    userSubtitle.textContent = '欢迎使用采购平台';
                    loginBtn.textContent = '退出';
                    loginBtn.onclick = () => this.logout();
                } else {
                    userAvatar.textContent = '访';
                    userTitle.textContent = '访客用户';
                    userSubtitle.textContent = '登录获得更多功能';
                    loginBtn.textContent = '登录';
                    loginBtn.onclick = () => goToLogin();
                }
            }

            bindEvents() {
                // 绑定事件监听器
                console.log('首页事件绑定完成');
            }

            logout() {
                if (window.authManager) {
                    window.authManager.logout();
                    this.updateUserStatus(false);
                    alert('已退出登录');
                }
            }
        }



        // 公司数据管理 - 使用静态数据
        const companies = [
            { id: 'company1', name: 'ABC采购公司', desc: '专业电子产品采购', type: '采购公司', area: '北京市' },
            { id: 'company2', name: 'XYZ贸易公司', desc: '工业原材料供应商', type: '贸易公司', area: '上海市' },
            { id: 'company3', name: 'DEF供应链', desc: '全品类采购服务', type: '供应链', area: '深圳市' },
            { id: 'company4', name: 'GHI商贸集团', desc: '大宗商品交易', type: '商贸集团', area: '广州市' },
            { id: 'company5', name: 'JKL进出口', desc: '国际贸易专家', type: '进出口', area: '天津市' },
            { id: 'company6', name: 'MNO采购中心', desc: '政府采购服务', type: '采购中心', area: '杭州市' },
            { id: 'company7', name: 'PQR供应链', desc: '快速配送服务', type: '供应链', area: '成都市' },
            { id: 'company8', name: 'STU贸易', desc: '专业化工采购', type: '贸易公司', area: '武汉市' },
            { id: 'company9', name: 'VWX商贸', desc: '建材采购专家', type: '商贸公司', area: '南京市' },
            { id: 'company10', name: 'YZA采购', desc: '食品原料供应', type: '采购公司', area: '西安市' },
            { id: 'company11', name: 'BCD电子', desc: '电子元器件采购', type: '电子公司', area: '苏州市' },
            { id: 'company12', name: 'EFG机械', desc: '机械设备采购', type: '机械公司', area: '重庆市' }
        ];

        let currentCompany = 'company1';
        let filteredCompanies = [...companies];
        let currentPage = 1;
        const itemsPerPage = 6; // 每页显示6个，2行3列布局

        // 初始化公司数据
        async function initCompanyData() {
            try {
                // 从API获取当前用户的公司信息，用于更新标题
                await loadCurrentCompanyFromAPI();
            } catch (error) {
                console.error('初始化公司数据失败:', error);
                // 使用默认公司名称
                updatePageTitle('采购平台');
            }
        }

        // 从API加载当前用户的公司信息（只用于更新标题）
        async function loadCurrentCompanyFromAPI() {
            try {
                // 获取当前用户信息
                const userInfo = window.authManager ? window.authManager.getUserInfo() : null;
                if (!userInfo || !userInfo.buserid) {
                    console.log('用户未登录或无buserid，使用默认标题');
                    updatePageTitle('采购平台');
                    return;
                }

                // 构建API请求URL
                const apiUrl = `http://dadefeng.com/srmddf/company/buysite?id=${userInfo.buserid}`;
                console.log('请求当前用户公司信息API:', apiUrl);

                const response = await fetch(apiUrl, {
                    method: 'GET',
                    headers: {
                        'Content-Type': 'application/json',
                        'Accept': 'application/json'
                    }
                });

                if (!response.ok) {
                    throw new Error(`HTTP ${response.status}: ${response.statusText}`);
                }

                const data = await response.json();
                console.log('API返回的公司信息:', data);

                if (data && data.result && data.result.companyname) {
                    // 更新页面标题为API返回的公司名称
                    updatePageTitle(data.result.companyname);
                    console.log('页面标题已更新为API返回的公司名称:', data.result.companyname);
                } else {
                    // API没有返回公司名称，使用默认标题
                    updatePageTitle('采购平台');
                }

            } catch (error) {
                console.error('从API加载公司信息失败:', error);
                // 使用默认标题
                updatePageTitle('采购平台');
            }
        }

        // 只更新h1标签
        function updatePageTitle(companyName) {
            const headerTitle = document.querySelector('.header h1');
            if (headerTitle) {
                headerTitle.textContent = `🏠 ${companyName}`;
                console.log('h1标签已更新为:', companyName);
            }
        }

        // 显示公司选择器
        function showCompanySelector() {
            document.getElementById('companyModal').style.display = 'block';
            renderCompanyList();
            renderPagination();
        }

        // 关闭公司选择器
        function closeCompanySelector() {
            document.getElementById('companyModal').style.display = 'none';
        }

        // 搜索过滤公司
        function filterCompanies() {
            const searchTerm = document.getElementById('companySearch').value.toLowerCase();
            filteredCompanies = companies.filter(company => 
                company.name.toLowerCase().includes(searchTerm) || 
                company.desc.toLowerCase().includes(searchTerm) ||
                company.type.toLowerCase().includes(searchTerm) ||
                company.area.toLowerCase().includes(searchTerm)
            );
            currentPage = 1;
            renderCompanyList();
            renderPagination();
        }

        // 渲染公司列表
        function renderCompanyList() {
            const companyList = document.getElementById('companyList');
            const startIndex = (currentPage - 1) * itemsPerPage;
            const endIndex = startIndex + itemsPerPage;
            const pageCompanies = filteredCompanies.slice(startIndex, endIndex);

            companyList.innerHTML = pageCompanies.map(company => `
                <div class="company-item ${company.id === currentCompany ? 'selected' : ''}" 
                     onclick="selectCompany('${company.id}')">
                    <div class="company-header">
                        <div class="company-name">${company.name}</div>
                        <div class="company-type">${company.type}</div>
                    </div>
                    <div class="company-desc">${company.desc}</div>
                    <div class="company-area">📍 ${company.area}</div>
                </div>
            `).join('');
        }

        // 渲染分页控件
        function renderPagination() {
            const totalPages = Math.ceil(filteredCompanies.length / itemsPerPage);
            const pagination = document.getElementById('pagination');
            
            if (totalPages <= 1) {
                pagination.innerHTML = '';
                return;
            }

            let paginationHTML = '';
            
            // 上一页
            if (currentPage > 1) {
                paginationHTML += `<span class="page-btn" onclick="goToPage(${currentPage - 1})">上一页</span>`;
            }
            
            // 页码
            for (let i = 1; i <= totalPages; i++) {
                if (i === currentPage) {
                    paginationHTML += `<span class="page-btn active">${i}</span>`;
                } else {
                    paginationHTML += `<span class="page-btn" onclick="goToPage(${i})">${i}</span>`;
                }
            }
            
            // 下一页
            if (currentPage < totalPages) {
                paginationHTML += `<span class="page-btn" onclick="goToPage(${currentPage + 1})">下一页</span>`;
            }
            
            pagination.innerHTML = paginationHTML;
        }

        // 跳转到指定页面
        function goToPage(page) {
            currentPage = page;
            renderCompanyList();
            renderPagination();
        }

        // 选择公司
        function selectCompany(companyId) {
            currentCompany = companyId;
            const company = companies.find(c => c.id === companyId);
            
            if (company) {
                console.log('切换到公司:', company.name);
                
                // 更新页面标题为选择的公司名称
                updatePageTitle(company.name);
                
                // 关闭弹窗
                closeCompanySelector();
            }
        }

        // 点击弹窗外部关闭
        window.onclick = function(event) {
            const modal = document.getElementById('companyModal');
            if (event.target === modal) {
                closeCompanySelector();
            }
        }

        // 页面加载完成后初始化公司数据
        document.addEventListener('DOMContentLoaded', () => {
            // 延迟初始化，等待认证管理器加载
            setTimeout(async () => {
                await initCompanyData();
                new HomePage();
            }, 100);
        });
    </script>
    
    <!-- 认证系统 -->
    <script src="auth.js"></script>
    <script src="api.js"></script>
    <script src="router.js"></script>
</body>
</html>